<template>
  <div class="FocusapplyContainer">
            <!-- 顶部菜单 -->
        <div class="top">
            <div class="left" @touchend="$router.back()">
                    <yd-icon name="back" slot="icon" custom  size=".3rem" color="#FFffff"></yd-icon>
                    返回
            </div>
            <div class="mid">
                请求列表
            </div>
            <div class="right"></div>
        </div>
        <!-- 主要内容 -->
        <div class="main">
            <div class="box" v-for="(list,index) in list" :key="index">
                    <div class="left">
                        <img :src="list.srcPhoto">
                    </div>
                    <div class="mid">
                        <p>{{list.srcUserName}}</p>
                        <p>{{list.srcMsg}}</p>
                    </div>
                    <div class="right">
                        <span @click="handel(index)" v-if="list.handleStatus==1">处理</span>
                        <span v-else>已同意</span>
                    </div>
            </div>
        </div>
  </div>
</template>
<script>
export default {
  data(){
      return{
          list:[],
          userDetail:null
      }
  },
  methods:{
      handel(index){
            // this.$router.push({path:"/common/userIntr",query:{status:"handel"}})
            let data={
                userId:this.list[index].srcUserID
            }
            this.ylAjax.searchFriendbyId(data)
                        .then(res=>{
                             console.log(res)
                            if(res.state==0){
                                console.log(res)
                                this.$store.commit("userDetail",res.data)
                                this.$router.push({path:"/common/userIntr",query:{status:"handelFocus",srcuser:this.list[index]}})                                
                            }else{
                                   this.$dialog.toast({
                                        mes: '出错啦',
                                        timeout: 1500,
                                        icon: 'error'
                                    });
                            }
                        })
        },
      showApply(){//查看信息
              let data={
                    userId:localStorage.userid
                }
            this.ylAjax.showfocusApply(data)
                        .then(res=>{
                            if(res.state==0){
                                console.log(res.data)
                                this.list=res.data
                    }
            })
      }
  },
  created(){
      this.showApply()
      console.log("1111")
  }
  
}
</script>

<style lang="less" scoped>
    @import "~less/base";
    .FocusapplyContainer{
        position: absolute;
        top:0;
        bottom: 0;
        width: 100%;
        overflow-y: scroll; 
        img{
            max-width: 100%;
            max-height: 100%;
        }
          .top{//顶部导航
            height: 1rem;
            line-height: 1rem;
            color: @color-t;
            background-color: @background-a;
            display: flex;
            font-size: 16px;
            .left{
                flex: 0 0 20%;
                text-align: center;
            }     
            .mid{
                flex: 0 0 60%;
                text-align: center
            }
            .right{
                flex: 0 0 20%;

            }
        }
        .main{
                .box{
                    display: flex;
                    margin-top: .2rem;
                    background-color: @background-bg;
                    padding: .2rem;
                    .left{
                        flex:0 0 20%;
                        img{
                            width: 1rem;
                            border-radius: 50%;
                        }
                    }
                    .mid{
                        flex: 0 0 60%
                    }
                    .right{
                        flex: 0 0 20%;
                        text-align: center;
                        line-height: 1rem;
                    }
                }
        }

    }
</style>
